import { onMounted, ref } from "vue";
import { getSwiper } from "@/api/api";
import { computed } from "@vue/reactivity";
import { useRouter } from "vue-router";
import { useUserStore } from "@/store";


export const useHomeHandler = () => {
  const userStore = useUserStore();
  const router = useRouter();
  const change1 = ref(true);
  const change2 = ref(false);
  const swipe = ref([]);
  const changeColor1 = () => {
    if (userStore.username && userStore.token) {
      change1.value = true;
      change2.value = false;
    } else {
      router.push("/login");
    }
  };
  const changeColor2 = () => {
    if (userStore.username && userStore.token) {
      change2.value = true;
      change1.value = false;
    } else {
      router.push("/login");
    }
  };
  onMounted(() => {
    swipeList();
  });
  const swipeList = async () => {
    let { data } = await getSwiper();
    swipe.value = data;
  };
  const gopay = computed(() => {
    if (!localStorage.getItem("username") && !localStorage.getItem("token")) {
      return "/login";
    } else {
      return "/goodsList";
    }
  });
  const gowallet = computed(() => {
    if (!localStorage.getItem("username") && !localStorage.getItem("token")) {
      return "/login";
    } else {
      return "/coffeewallet";
    }
  });
  const giveHerCoffee = computed(() => {
    if (!localStorage.getItem("username") && !localStorage.getItem("token")) {
      return "/login";
    } else {
      return "/standtreat";
    }
  });
  const goSaoMa = () => {
    router.push("/saoma");
  };

  return {
    change1,
    change2,
    swipe,
    changeColor1,
    changeColor2,
    gopay,
    gowallet,
    giveHerCoffee,
    goSaoMa,
  };
};
